<template>
  <div>
    <div class="membernumber">
          <!-- 当你访问一个未定义的属性的时候就会报错，我们可以通过v-if来判断是否有这个属性，如果有这个属性就渲染如果没有这个属性就不渲染 -->
          <span class="membernumber-left"
            >会员人数 <span @click="open" class="membernumber_right" v-if="memberNum1[1]">{{memberNum1[1].value}}</span></span
          >
          <span class="commenrceclass">商会等级<span> 一等</span></span>
        </div>
                    <!-- 弹框 -->
    <Bigscreen :openBigscreendialog="parent" @changeBigscreen="changeBigscreen" ></Bigscreen>
  </div>
</template>

<script>

import { mapState } from "vuex";
import Bigscreen from '../bigscreenprop/bigscreenprop.vue'
export default {
  name: "modulemiddle",
    components: {
            Bigscreen
    },
  data() {
    return {
      selectStarUserlist: [],
      parent: false,
    };
  },
  mounted() {
    // this.getselectStarUser()

  },
  computed: {
    // 计算属性里面的函数必须要调用才能执行哦
    // 使用辅助函数
     ...mapState({
      memberNum1: (state) => {
         return state.bigscreen.menmberNum;
      },
      // memberNum: state => state.bigscreen.memberNum,
    }),
  },
  methods: {
      open(){
        console.log(11)
      this.parent = true
      },
      changeBigscreen(e,callback){
      console.log('父组件执行逻辑',e)
       this.parent = e
       callback(false)
      }
  },
};
</script>

<style lang="scss" scoped> 
$color-blue: #0d3d7f;
$font-color: #09f5fc;
$text-color: #fff;
.membernumber {
  display: flex;
  justify-content: space-between;
  // background-color: $color-blue;
  padding: 50px 5px;

  & > .membernumber-left {
    color: $font-color;
    // font-size: 24px;
    padding: 10px 10px;
    .membernumber_right {
      color: $text-color;
      // font-size: 24px;
      padding: 10px 10px;
      height: 40px;
      width: 40px;
      border: #09f5fc 1px solid;
      border-radius: 5px;
      line-height: 40px;
      text-align: center;
      margin-left: 20px;
    }
  }

  & > .commenrceclass {
    color: $font-color;
    // font-size: 24px;
    padding: 10px 10px;
    & > span {
      color: $text-color;
    }
  }
}
</style>